<template>
  <div>
      <h1>test-reactive</h1>
      <p>name: {{ person.name }}</p>
      <p>age: {{ person.age }}</p>
  </div>
</template>

<script>
import { defineComponent } from "@vue/runtime-core";
import { reactive } from "vue";

export default defineComponent({
    setup() {
        console.log("---reactive---")
        const obj = {
            name: "天下"
        }
        const person = reactive(obj)

        console.log(obj === person)
        
        setTimeout(()=>{
            person.name = "晓";
            person.age = 18;
        },1000)
        return {
            person,
        }
    }
})
</script>

<style>

</style>